<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title></title>
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/common.js"></script>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link href="css/style.css" rel="stylesheet"/>
    <style>
        body{
            background-color: #eeeeee;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="profit-top">
            <div class="profit-head">
                <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left l-arrow"></a>

                <div class="fr">
                    <span class="question-icon"></span>
                    <span class="profit-head-rule">收益规则</span>
                </div>
            </div>

            <div class="my-profit">
                <p class="profit-price">4768.0</p>
                <P class="profit-text">总收益（元）</P>

                <a href="apply-withdrawals.html" class="withdrawals-btn">申请提现</a>
            </div>
        </div>

        <div class="history-title">历史收益记录</div>
        <div class="profit-content">
        	<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
	  			<div class="mui-scroll">
				    <!--数据列表-->
				    <ul class="mui-table-view mui-table-view-chevron">
			            <li class="profit-item">
			                <div class="his-pro-time">
			                    <span class="d-progress-circular"></span>
			                    &nbsp;&nbsp;2017-02-09 11:36
			                </div>
			
			                <div class="mission-item">
			                    <div class="his-pro-content">
			                        <div class="pro-order-top">
			                            <div class="pro-order-no fl">订单编号201702091136</div>
			                            <div class="pro-order-yellow fr">未提现</div>
			                        </div>
			
			                        <div class="pro-order-price">订单金额：600元</div>
			
			                        <div class="his-pro-bottom flex-box">
			                            <div class="pro-profit-price flex a-line">
			                                平台收益：<span>1234元</span>
			                            </div>
			                            <div class="pro-profit-price flex a-line">
			                                商户收益：<span>1234元</span>
			                            </div>
			                        </div>
			                    </div>
			                </div>
			            </li>

			            <li class="profit-item">
			                <div class="his-pro-time">
			                    <span class="d-progress-circular"></span>
			                    &nbsp;&nbsp;2017-02-09 11:36
			                </div>
			
			                <div class="mission-item">
			                    <div class="his-pro-content">
			                        <div class="pro-order-top">
			                            <div class="pro-order-no fl">订单编号201702091136</div>
			                            <div class="pro-order-right fr"> 已结算</div>
			                        </div>
			
			                        <div class="pro-order-price">订单金额：600元</div>
			
			                        <div class="his-pro-bottom flex-box">
			                            <div class="pro-profit-price flex a-line">
			                                平台收益：<span>1234元</span>
			                            </div>
			                            <div class="pro-profit-price flex a-line">
			                                商户收益：<span>1234元</span>
			                            </div>
			                        </div>
			                    </div>
			                </div>
			            </li>
		            </ul>
	            </div>
            </div>
        </div>

        <!--<p class="read-more">已经全部加载完毕！</p>-->
    </div>
    
    <script type="text/javascript">
			$(function() {
				mui.init({
					pullRefresh : {
					    container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
					    down : {
					      style:'circle',//必选，下拉刷新样式，目前支持原生5+ ‘circle’ 样式
					      color:'#ff850b', //可选，默认“#2BD009” 下拉刷新控件颜色
					      height:'50px',//可选,默认50px.下拉刷新控件的高度,
					      range:'100px', //可选 默认100px,控件可下拉拖拽的范围
					      offset:'220px', //可选 默认0px,下拉刷新控件的起始位置
					      auto: true,//可选,默认false.首次加载自动上拉刷新一次
					      callback: ()=>{
					      	setTimeout(()=> {
					      		mui('#refreshContainer').pullRefresh().endPulldown();
					      	}, 1000)
					      } 
					    },
					    up : {
					      height:50,//可选.默认50.触发上拉加载拖动距离
					      auto:false,//可选,默认false.自动上拉加载一次
					      contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
					      contentnomore:'已经全部加载完毕！',//可选，请求完毕若没有更多数据时显示的提醒内容；
					      callback : ()=> {
					      	setTimeout(()=> {
					      		mui('#refreshContainer').pullRefresh().endPullup(false);
					        }, 1000)
					      }
					    }
				    },
				});
				
				mui.plusReady(function(){			    	
			    	mui('.my-profit').on('tap', '.withdrawals-btn', ()=> {
			    		mui.openWindow({
							url: 'apply-withdrawals.html',
							id: 'apply-withdrawals.html'
						});
			    	})
			    })
			})
		</script>
</body>
</html>